Design System & CSS Variables Architecture - #594
Conversation
|
@DebasmitaBose0 is attempting to deploy a commit to the komalsony234-1530's projects Team on Vercel. A member of the Team first needs to authorize it. |
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
Adds CSS custom properties for the app’s design tokens and introduces a basic dark-mode override using prefers-color-scheme.
Changes:
- Define global CSS variables for colors and spacing.
- Add dark-mode overrides for main text and background variables.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| :root { | ||
| --primary-color: #4f46e5; | ||
| --secondary-color: #10b981; | ||
| --text-main: #1f2937; | ||
| --bg-main: #ffffff; | ||
| --spacing-md: 1rem; | ||
| } | ||
| @media (prefers-color-scheme: dark) { | ||
| :root { | ||
| --text-main: #f9fafb; | ||
| --bg-main: #111827; | ||
| } | ||
| } |
komalharshita
added
gssoc:invalid
|
Thanks for the contribution and for thinking about improving the design system architecture with CSS variables. However, this PR is too incomplete to merge in its current state. Right now the PR only introduces a few root-level CSS variables:
but none of the existing stylesheet actually migrates to use these variables. As a result:
The PR title suggests a broader “Design System & CSS Variables Architecture” refactor, but the implementation is currently only a small starter snippet rather than a complete architectural improvement. Additionally:
Because the feature is currently partial and not production-impactful, I’m closing this PR for now rather than merging an incomplete architecture layer. You’re welcome to reopen with:
Appreciate the effort and direction here. |
Closed #593
Problem:
The
style.cssstylesheet uses hardcoded hex colors and sizing values throughout the file. This makes enforcing visual consistency difficult, scaling the design cumbersome, and supporting dynamic themes (like Dark Mode) nearly impossible.Acceptance Criteria:
:root).@media (prefers-color-scheme: dark).